<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的收藏</title>
    <link rel="stylesheet" href="styles.css">
    <style>
        .list-header { 
            background-color: white; 
            padding: 15px; 
            border-bottom: 1px solid #eee; 
            font-size: 18px; 
            font-weight: 500; 
            text-align: center; 
        }
        .page-content { 
            padding: 15px; 
        }
        .collection-item {
            display: block;
            padding: 10px 0;
            border-bottom: 1px solid #eee;
            text-decoration: none;
            color: inherit;
            text-align: left;
        }
        .collection-item h4 {
            margin: 0 0 5px 0;
            font-size: 16px;
            font-weight: 500;
        }
        .collection-item p {
            margin: 0;
            font-size: 12px;
            color: #999;
        }
    </style>
</head>
<body>
    <div class="list-header">我的收藏</div>
    <div class="container">
        <div class="page-content">
            <h2>收藏的动态/景区</h2>
            
            <a href="feed_detail.html" class="collection-item">
                <h4>[动态] 标题：我发现了一个超美的瀑布！</h4>
                <p>作者：旅行家A | 收藏日期：2024/05/10</p>
            </a>
            <a href="feed_detail.html" class="collection-item">
                <h4>[动态] 标题：景区美食测评，这家的烤串绝了。</h4>
                <p>作者：吃货B | 收藏日期：2024/05/08</p>
            </a>
            <a href="map.html" class="collection-item">
                <h4>[地点] 荔香公园</h4>
                <p>分类：自然风光 | 收藏日期：2024/05/05</p>
            </a>
            
            <p style="margin-top: 30px; color: #999; text-align: center;">您可以在这里管理您收藏的帖子、地点和路线。</p>
        </div>
    </div>
    <div class="bottom-nav">
        <a href="index.html" class="nav-item">
            <span class="icon">🏠</span>
            <span>首页</span>
        </a>
        <a href="discovery.html" class="nav-item">
            <span class="icon">🔍</span>
            <span>动态</span>
        </a>
        <a href="map.html" class="nav-item">
            <span class="icon">🗺️</span>
            <span>手气不错</span>
        </a>
        <a href="collection_list.html" class="nav-item active">
            <span class="icon">📚</span>
            <span>收藏</span>
        </a>
        <a href="profile.html" class="nav-item">
            <span class="icon">👤</span>
            <span>我的</span>
        </a>
    </div>
</body>
</html>